<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta name="description" content="">
		<meta name="author" content="">
		<title>新建订单</title>
		<link rel="stylesheet" href="../../css/base.css" />
		<link rel="stylesheet" href="../../css/common.css" />
		<!-- Bootstrap Core CSS -->
		<link href="../../sbadmin/bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
		<!-- MetisMenu CSS -->
		<link href="../../sbadmin/bower_components/metisMenu/dist/metisMenu.min.css" rel="stylesheet">
		<!-- DataTables CSS -->
		<link href="../../sbadmin/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.css" rel="stylesheet">
		<!-- Custom CSS -->
		<link href="../../sbadmin/dist/css/sb-admin-2.css" rel="stylesheet">
		<!-- Custom Fonts -->
		<link href="../../sbadmin/bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
		<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
	<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
	<![endif]-->
		<style>
			body {
				padding: 0 15px !important;
			}
			
			.edit-item-tt {
				width: 100px;
			}
		</style>
	</head>

	<body style="background:#FFF;">
		<div class="comm-tt-font pr">
			订单 > 新建订单
		</div>
		<div class="zl-ccbox" style="margin-top: 20px;">
			<div class="zl-cccc pr">
				<div class="edit-item clb">
					<div class="edit-item-tt fl"><em>*</em>姓名：</div>
					<div class="edit-item-cc fl ml10">
						<input type="text" class="edit-input" style="width: 200px;" nameId="" id="uname" placeholder="请输入姓名或手机号" />
					</div>
					<a href="javascript:void(0)" class="add-searchbtn fl ml10" id="dd-searchbtn">搜索</a>
				</div>
				<div class="edit-item clb">
					<div class="edit-item-tt fl"><em>*</em>出售门店：</div>
					<div class="edit-item-cc fl ml10">
						<select class="eic-select" style="width: 200px;" id="storeSelect"></select>
					</div>
				</div>
				<div class="edit-item clb">
					<div class="edit-item-tt fl"><em>*</em>拍摄类型：</div>
					<div class="edit-item-cc fl ml10">
						<select class="eic-select" style="width: 200px;" id="ptype"></select>
					</div>
				</div>
				<div class="edit-item clb">
					<div class="edit-item-tt fl"><em>*</em>商品：</div>
					<div class="edit-item-cc fl ml10">
						<select class="eic-select" style="width: 200px;" id="skuSelect"></select>
					</div>
				</div>
				<div class="edit-item clb none" id="bbShowBox">
					<div class="edit-item-tt fl"><em>*</em>宝宝：</div>
					<div class="edit-item-cc fl ml10">
						<ul class="shop-type clb mt5" id="bbList">

						</ul>
					</div>
				</div>
				<div class="edit-item clb">
					<div class="edit-item-tt fl"><em>*</em>应收金额：</div>
					<div class="edit-item-cc fl ml10">
						<input type="text" class="edit-input" style="width: 200px;" id="ysPrice" disabled="disabled" />
					</div>
				</div>
				<div class="edit-item clb">
					<div class="edit-item-tt fl"><em>*</em>实付金额：</div>
					<div class="edit-item-cc fl ml10">
						<input type="text" class="edit-input" style="width: 200px;" id="sfPrice" />
					</div>
				</div>
				<div class="edit-item clb">
					<div class="edit-item-tt fl"><em>*</em>支付方式：</div>
					<div class="edit-item-cc fl ml10">
						<select class="eic-select" style="width: 200px;" id="zfFun">
							<option value="">--请选择--</option>
							<option value="2">刷卡</option>
							<option value="0">微信</option>
							<option value="3">现金</option>
							<option value="1">支付宝</option>
						</select>
					</div>
				</div>
				<div class="edit-item clb">
					<div class="edit-item-tt fl"><em>*</em>支付流水号：</div>
					<div class="edit-item-cc fl ml10">
						<input type="text" class="edit-input" style="width: 200px;" id="orderNum" />
					</div>
				</div>
				<div class="edit-item clb mt20">
					<div class="edit-item-tt fl"></div>
					<div class="edit-item-cc fl ml10">
						<a href="list.html" class="fl commqx-btn">取消</a>
						<a href="javascript:void(0);" class="fl commqr-btn ml15" id="orderAdd">确定</a>
					</div>
				</div>
			</div>
		</div>
		<div class="comm-mbbox none"></div>
		<div class="person-showbox none">
			<div class="panel-body" style="padding-top: 0 !important;">
				<div class="dataTable_wrapper" id="app">
					<table class="table table-striped table-bordered table-hover" id="dataTables-example">
						<thead>
							<tr>
								<th>会员编号</th>
								<th>姓名</th>
								<th>性别</th>
								<th>手机号</th>
								<th>操作</th>
							</tr>
						</thead>
						<tbody id="list-td">

						</tbody>
					</table>
				</div>
				<!-- /.table-responsive -->
			</div>
		</div>
		<!-- jQuery -->
		<script src="../../sbadmin/bower_components/jquery/dist/jquery.min.js"></script>
		<!-- Bootstrap Core JavaScript -->
		<script src="../../sbadmin/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
		<!-- Metis Menu Plugin JavaScript -->
		<script src="../../sbadmin/bower_components/metisMenu/dist/metisMenu.min.js"></script>
		<!-- DataTables JavaScript -->
		<script src="../../sbadmin/bower_components/datatables/media/js/jquery.dataTables.min.js"></script>
		<script src="../../sbadmin/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js"></script>
		<!-- Custom Theme JavaScript -->
		<script src="../../sbadmin/dist/js/sb-admin-2.js"></script>
		<script src="../../js/layer/layer.js"></script>
		<script type="text/javascript" src="../../js/common.js"></script>
		<script type="text/javascript" src="../../js/jquery-ui.min.js"></script>
		<!-- Page-Level Demo Scripts - Tables - Use for reference -->
		<script>
			$(".person-showbox").draggable(); //为模态对话框添加拖拽

			$(function() {
				$("#dd-searchbtn").click(function() {
					var unameText = $("#uname").val();;
					var nameText = "";
					var telText = "";
					var reg = /^\w+$/;
					if(!reg.test(unameText)) {
						nameText = unameText;
					} else {
						telText = unameText;
					}
					getList(telText, nameText);

				})

			})

			function getList(tel, name) {
				$("#dataTables-example").dataTable().fnDestroy();
				var user = {
					phone: tel,
					name: name,
					type: 0
				}
				$.ajax({
					url: "https://order.wz1996.wang/wzbg/user/query/customer",
					type: 'post',
					contentType: 'application/json',
					data: JSON.stringify(user),
					beforeSend: function(request) {
						request.setRequestHeader("token", localStorage.getItem("token"));
					},
					success: function(data) {
						console.log(data)
						if(data.code == "1") {
							var html = "";
							for(var i = 0; i < data.data.length; i++) {
								html += "<tr class='odd gradeX'>";
								html += "<td>" + data.data[i].id + "</td>";
								html += "<td>" + data.data[i].name + "</td>";
								if(data.data[i].sex == "1") {
									html += "<td>男</td>";
								} else if(data.data[i].sex == "0") {
									html += "<td>女</td>";
								} else {
									html += "<td></td>";
								}
								html += "<td>" + data.data[i].phone + "</td>";
								html += "<td><a href='javascript:void(0);' class='sDetail' name='" + data.data[i].name + "' id='" + data.data[i].id + "'>选择</a></td>";
								html += "</tr>";
							}
							$("#list-td").html(html);
							$('#dataTables-example').DataTable({
								responsive: false,
								bLengthChange: false,
								bSort: true,
								paging: true,
								bFilter: true,
								searching: false,
								bInfo: true,
								bAutoWidth: true,
								"oLanguage": {
									"sLengthMenu": "每页显示 _MENU_ 条记录",
									"sZeroRecords": "抱歉， 没有找到",
									"sInfo": "从 _START_ 到 _END_ /共 _TOTAL_ 条数据",
									"sInfoEmpty": "没有数据",
									"sInfoFiltered": "(从 _MAX_ 条数据中检索)",
									"oPaginate": {
										"sFirst": "首页",
										"sPrevious": "前一页",
										"sNext": "后一页",
										"sLast": "尾页"
									},
									"sSearch": "查询条件:",
									"sZeroRecords": "没有检索到数据",
									"sProcessing": "<img src='./loading.gif' />"
								}
							});
						} else if(data.code == "-1") {
							layar(data.msg);
							setTimeout("window.parent.frames.location.href='/xcxadmin/login.html'", 1000)
						} else {
							layar(data.msg);
						}

					},
					error: function(e) {
						errcode(e);
					}
				});
			}
			$(".comm-mbbox").css("width", $(window).width() + 250);
			$("#dd-searchbtn").click(function() {
				$(".comm-mbbox").show();
				$(".person-showbox").show();
			})
			$(".comm-mbbox").click(function() {
				$(".comm-mbbox").hide();
				$(".person-showbox").hide();
			})

			$("#list-td").on("click", ".sDetail", function() {
				var id = $(this).attr("id");
				var name = $(this).attr("name");
				$("#uname").val(name);
				$("#uname").attr("nameId", id);
				$(".comm-mbbox").hide();
				$(".person-showbox").hide();
				getBB(id);
			})
			//填充商品分类
			$.ajax({
				url: "https://order.wz1996.wang/wzbg/category/album",
				type: 'get',
				contentType: 'application/json',
				beforeSend: function(request) {
					request.setRequestHeader("token", localStorage.getItem("token"));
				},
				success: function(data) {
					console.log(data);
					var html = "";
					if(data.code == "1") {
						html += "<option value=''>--请选择--</option>";
						for(var i = 0; i < data.data.length; i++) {
							html += "<option value='" + data.data[i].id + "'>" + data.data[i].name + "</option>";
						}
						$("#ptype").html(html);
					} else {
						layar(data.msg);
					}
				},
				error: function(e) {
					errcode(e);
				}
			});
			//选了儿童出现宝宝 过滤商品
			$("#ptype").on("change", function() {
				if($("#storeSelect option:selected").val() == "" || $("#storeSelect option:selected").val() == null || $("#storeSelect option:selected").val() == undefined) {
					layar("请选择门店！");
					$(this).val("");
				} else {
					goodsType($(this).val(), $("#storeSelect option:selected").val())
				}
				/*if($("#uname").attr("nameid") == "") {
					layar("请选择用户！");
					$(this).val("");
				} else {*/
				/*$("#bbShowBox").hide();*/

				/*}*/
			})
			$('#skuSelect').on("change", function() {
				var isKid = $("#skuSelect option:selected").attr("isKid");
				/*if($("#uname").attr("nameid") == "") {
					layar("请选择用户！");
					$(this).val("");
				} else {*/
				if(isKid == "1") {
					$("#bbShowBox").show();
				} else {
					$("#bbShowBox").hide();
				}
				/*}*/

			})
			//填充宝宝
			function getBB(uid) {
				var post_data = {
					"userId": uid
				}
				$.ajax({
					url: "https://order.wz1996.wang/wzbg/kid/query",
					type: 'post',
					contentType: 'application/json',
					data: JSON.stringify(post_data),
					beforeSend: function(request) {
						request.setRequestHeader("token", localStorage.getItem("token"));
					},
					success: function(data) {
						console.log(data);
						var html = "";
						if(data.code == "1") {
							for(var i = 0; i < data.data.kid.length; i++) {
								html += "<li id=" + data.data.kid[i].id + ">" + data.data.kid[i].name + "</li>";
							}
							$("#bbList").html(html);
						} else {
							layar(data.msg);
						}
					},
					error: function(e) {
						errcode(e);
					}
				});
			}

			function goodsType(cid, sid) {
				$.ajax({
					url: "https://order.wz1996.wang/wzbg/sku/store?categoryId=" + cid + "&storeId=" + sid,
					type: 'get',
					contentType: 'application/json',
					beforeSend: function(request) {
						request.setRequestHeader("token", localStorage.getItem("token"));
					},
					success: function(data) {
						console.log(data);
						var html = "";
						if(data.code == "1") {
							if(data.data.length != 0) {
								html += "<option value=''>--请选择--</option>";
								for(var i = 0; i < data.data.length; i++) {
									html += "<option price='" + data.data[i].salePrice + "' isKid='" + data.data[i].isKid + "' value='" + data.data[i].id + "'>" + data.data[i].name + "</option>";
								}
								$("#skuSelect").html(html);
							} else {
								layar("没有商品！");
								$("#skuSelect").html("");

							}
						} else {
							layar(data.msg);
						}
					},
					error: function(e) {
						errcode(e);
					}
				});
			}

			//获取商品金额
			$("#skuSelect").on("change", function() {
				var spPrice = $("#skuSelect option:selected").attr("price");
				$("#ysPrice").val(spPrice);
			})

			//填充门店
			$.ajax({
				url: "https://order.wz1996.wang/wzbg/store/all",
				type: 'get',
				contentType: 'application/json',
				beforeSend: function(request) {
					request.setRequestHeader("token", localStorage.getItem("token"));
				},
				success: function(data) {
					console.log(data);
					var html = "";
					if(data.code == "1") {
						html += "<option value=''>--请选择--</option>";
						for(var i = 0; i < data.data.length; i++) {
							html += "<option value='" + data.data[i].id + "'>" + data.data[i].name + "</option>";
						}
						$("#storeSelect").html(html);
					} else {
						layar(data.msg);
					}
				},
				error: function(e) {
					errcode(e);
				}
			});
			var bbarr = []; //门店类型
			$("#bbList").on("click", "li", function() {
				var hasClass = $(this).hasClass("cur");
				var th = "";
				if(hasClass) {
					$(this).removeClass("cur");
					for(var i = 0; i < bbarr.length; i++) {
						if(bbarr[i].id == $(this).attr("id")) {
							bbarr.splice(i, 1);
							i--;
						}
					}
				} else {
					$(this).addClass("cur");
					th = $(this).attr("id");
					bbarr.push(th);
				}
			})

			//添加订单
			$("#orderAdd").click(function() {
				var orderName = $("#uname").attr("nameid");
				var orderType = $("#ptype option:selected").val();
				var orderSku = $("#skuSelect option:selected").val();
				var sfPrice = $("#sfPrice").val();
				var zfFun = $("#zfFun option:selected").val();
				var orderNum = $("#orderNum").val();
				var storeSelect = $("#storeSelect option:selected").val();
				if(orderName == "") {
					layar("请选择会员！");
				} else if(storeSelect == "" || storeSelect == null || storeSelect == undefined) {
					layar("请选择出售门店！");
				} else if(orderType == "" || orderType == null || orderType == undefined) {
					layar("请选择拍摄类型！");
				} else if(orderSku == "" || orderSku == null || orderSku == undefined) {
					layar("请选择商品！");
				} else if(sfPrice == "") {
					layar("请输入实付金额！");
				} else if(sfPrice > $("#ysPrice").val()) {
					layar("实付金额不能大于应收金额！");
				} else if(zfFun == "" || zfFun == null || zfFun == undefined) {
					layar("请选择支付方式！");
				} else if(orderNum == "") {
					layar("请输入支付流水号！");
				} else {
					var order_data = {
						"batch": orderNum,
						"kidIds": bbarr,
						"payType": zfFun,
						"price": sfPrice,
						"skuId": orderSku,
						"storeId": storeSelect,
						"userId": orderName
					}
					$.ajax({
						url: "https://order.wz1996.wang/wzbg/order/add",
						type: 'post',
						contentType: 'application/json',
						data: JSON.stringify(order_data),
						beforeSend: function(request) {
							request.setRequestHeader("token", localStorage.getItem("token"));
						},
						success: function(data) {
							console.log(data);
							if(data.code == "1") {
								layar("添加成功！");
								setTimeout("window.location.href='list.html'", 1000)
							} else {
								layar(data.msg);
							}
						},
						error: function(e) {
							errcode(e);
						}
					});
				}

			})
		</script>
	</body>

</html>